<template>
  <a-drawer
    title="数据规则配置"
    width="365"
    :closable="false"
    :visible="visible"
    @close="close"
  >
    <a-checkbox-group v-model="dataruleChecked" v-if="dataruleList.length>0">
      <a-row>
        <a-col :span="24" v-for="(item,index) in dataruleList" :key=" 'dr'+index ">
          <a-checkbox :value="item.id">{{ item.ruleName }}</a-checkbox>
        </a-col>

        <a-col :span="24">
          <div style="width: 100%;margin-top: 15px">
            <a-button @click="handleSubmit" type="primary" size="small" icon="save">点击保存</a-button>
          </div>
        </a-col>
      </a-row>
    </a-checkbox-group>
    <div v-else><h3>无配置信息!</h3></div>
  </a-drawer>
</template>

<script>
import { apiQueryDepartDataRule, apiSaveDepartDataRule } from '@/api/system'
export default {
  name: 'DepartDataRuleModal',
  data () {
    return {
      visible: false,
      permissionId: '',
      departId: '',
      dataruleList: [],
      dataruleChecked: []
    }
  },
  methods: {
    show (permissionId, departId) {
      this.visible = true
      this.permissionId = permissionId
      this.departId = departId
      this.dataruleChecked = []
      this.loadData()
    },
    close () {
      this.visible = false
    },
    loadData () {
      apiQueryDepartDataRule(this.permissionId, this.departId).then(res => {
        console.log(res)
        if (res.success) {
          this.dataruleList = res.result.datarule
          const drChecked = res.result.drChecked
          if (drChecked) {
            this.dataruleChecked = drChecked.split(',')
          }
        } else {
          this.dataruleList = []
        }
      })
    },
    handleSubmit () {
      const params = {
        permissionId: this.permissionId,
        departId: this.departId,
        dataRuleIds: this.dataruleChecked.join(',')
      }
      console.log('保存数据权限', params)
      apiSaveDepartDataRule(params).then(res => {
        if (res.success) {
          this.$message.success(res.message)
        } else {
          this.$message.error(res.message)
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
